<template>
  <div class="cont">
    <div class="div">
      <!-- 内容 -->
      <el-table :data="tableData" border style="width: 100%;" >
        <el-table-column label="日期"  width="220">
          <template slot-scope="scope">
          {{ scope.row.createTime | formatTimer}}
           </template>
        </el-table-column>

        <!-- ----------------------------------------- -->
        <el-table-column prop="id" label="论文ID">
        </el-table-column>
        <el-table-column prop="title" label="论文名称"  width="220">
        </el-table-column>
        <el-table-column prop=""  label="论文内容"  width="220">
      <template slot-scope="scope">
          <el-button
              type="primary"
              size="small"
              @click="drawers(scope.row.content)"
            
              >查看内容</el-button
            >
            </template>

        </el-table-column>
        <el-table-column prop="author" label="论文作者"  width="220">
        </el-table-column>
 
      
        <el-table-column  label="操作"  width="220">
          <template slot-scope="scope">
           
            <el-button type="danger" size="small" @click="deletes(scope.row.id)">
              删除
            </el-button>
          </template>
        </el-table-column>

       
      </el-table>

      <!-- 分页 -->
    <el-pagination
      background
      layout="prev, pager, next"
      :total="Pagination.total"
      style="margin: 20px 20px 20px 0px"
      @current-change="currentchange"
      :page-size="Pagination.pageSize"
    >
    </el-pagination>
    <!-- 论文内容 -->
    <el-drawer
  title="我是标题"
  :visible.sync="drawer"
  :with-header="false"
  size="500px"
  style="font-size:15px">
  <div v-html="paperCont" class="padd"></div>
</el-drawer>
    </div>
  </div>
</template>

<script>
export default {
    data() {
    return {
        paperCont:"",
        drawer: false,
         //分页
      Pagination: {
        page: 1,
       pageSize: 7,
        total: 2,
      },
      users:{
        name:"",
        password:""
      },

      tableData: []
    }
  },
  mounted() {
this.currentchange()
  },
  filters:{
    byNoOk(vule){
     if (vule == 1)
     return "√ 已通过"
     else if(vule == 0)
     return "× 未通过"
    }
  },
  methods: {
      deletes(id){
          this.$http.post('/paper/del',{
             id
          }).then((res)=>{
          this.currentchange()
          })
      },
      drawers(z){
          
          this.paperCont = z
          this.drawer = true
      },
   
    // inquire(){

    //   this.currentchange ()
    // },
    currentchange(z) {
      if(z){    this.Pagination.page = z; }
      this.$http
        .get("/paper/", {
          ...this.Pagination,   
        })
        .then((res) => {
          console.log(res);
          this.tableData = res.data;
          this.Pagination.page = Number(res.page);
          this.Pagination.pageSize = Number(res.pageSize);
          this.Pagination.total = Number(res.total);
        });
       
    },
    login(){
        this.$http
        .post("/login/", {
         ...this.users
        })
        .then((res) => {localStorage.setItem('token_z',res.info.token)})}
    }
}
</script>

<style scoped>
.padd{
  margin: 15px;
}
.cont{
  animation: fadeInLeft; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 0.9s;
    /* margin-top:35px */
}
.div {
  padding: 15px;
  padding-right: 70px;
  /* border: 1px solid #000; */
  
}
.from {
  width: 100px;
}
</style>